<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>阿呆社区</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" th:href="@{/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/css/bootstrap-theme.min.css}">
    <link rel="stylesheet" th:href="@{/css/ardai.css}">
    <link rel="shortcut icon" th:href="@{/img/shotcut.png}">
    <script th:src="@{/js/jquery-3.4.1.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
</head>
<body>
<nav class="navbar navbar-default">
    <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                <span class="sr-only">阿呆社区</span>
            </button>
            <a class="navbar-brand" th:href="@{/list}">Ardai</a>
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <form class="navbar-form navbar-left">
                <div class="form-group">
                    <input type="text" class="form-control" placeholder="Search">
                </div>
                <button type="submit" class="btn btn-default">搜索问题</button>
            </form>
            <ul class="nav navbar-nav navbar-right">
                <li th:if="${session.user==null}"><a th:href="@{/toLogin}">登陆</a></li>
                <li th:if="${session.user!=null}" class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"><img th:src="@{${session.user.avatar}}" style="width: 40px;border-radius: 50%"/> <span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">消息中心</a></li>
                        <li><a th:href="@{/toAddPost}">发布帖子</a></li>
                        <li><a th:href="@{/userInfo(uid=${session.user.id})}">个人资料</a></li>
                        <li><a th:href="@{/logout}">退出登陆</a></li>
                    </ul>
                </li>
            </ul>
        </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
</nav>
<div class="container-fluid main">
    <div class="row">
        <div class="col-lg-9 col-md-12 col-sm-12 col-xs-12">
            <h4><span th:text="${post.title}">帖子标题1111</span></h4>
            作者: <span style="color: #2aabd2" th:text="${post.user.username}">陈大可</span>&nbsp;|&nbsp;
            浏览次数: <span th:text="${post.view}">22</span>&nbsp;|&nbsp;
            发布时间: <span th:text="${#dates.format(post.createTime,'yyyy-MM-dd HH:mm')}">2020-12-14</span>&nbsp;|&nbsp;
            评论数: <span th:text="${post.comments}">2</span>&nbsp;|&nbsp;
            <hr/>
                <div th:if="${post.postImg!=null || post.postImg!=''}" class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <img class="col-lg-6 col-md-6 col-sm-6 col-xs-6 col-md-offset-1"  th:src="@{${post.postImg}}" >
                </div>
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <p style="margin-top: 15px" th:text="${post.content}">我我哇哇哇哇哇哇哇哇哇哇我我我问问我我我我我 我我哇哇哇哇哇哇哇哇哇哇我我我问问我我我我我
                        我我哇哇哇哇哇哇哇哇哇哇我我我问问我我我我我 我我哇哇哇哇哇哇哇哇哇哇我我我问问我我我我我
                        我我哇哇哇哇哇哇哇哇哇哇我我我问问我我我我我 我我哇哇哇哇哇哇哇哇哇哇我我我问问我我我我我 我我哇哇哇哇哇哇哇哇哇哇我我我问问我我我我我
                        我我哇哇哇哇哇哇哇哇哇哇我我我问问我我我我我 我我哇哇哇哇哇哇哇哇哇哇我我我问问我我我我我 我我哇哇哇哇哇哇哇哇哇哇我我我问问我我我我我
                    </p>
                </div>
            <hr class="col-lg-12 col-md-12 col-sm-12 col-xs-12 comment-sp">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="margin-top: 10px">
                <button th:each="tag:${tags}" th:text="${tag.name}" type="button" class="btn btn-info" style="margin-right: 10px">Java</button>
            </div>
            <hr class="col-lg-12 col-md-12 col-sm-12 col-xs-12 comment-sp">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <h4>
                    <span th:text="${post.comments}">0</span> 个评论
                </h4>
                <p th:each="comment,commentStat:${comments}">
                    <span th:text="${commentStat.count}">1</span>楼
                    <img th:src="@{${comment.user.avatar}}" style="width: 60px;border-radius: 50%;" alt="not find">&nbsp;&nbsp;&nbsp;<a th:href="@{/userInfo(uid=${comment.user.id})}" th:if="${comment.user.owner==2}" style="color: #2aabd2" th:text="${comment.user.username}"></a><a th:href="@{/userInfo(uid=${comment.user.id})}" th:if="${comment.user.owner==1}" style="color: pink" th:text="${comment.user.username}"></a><a th:href="@{/userInfo(uid=${comment.user.id})}" th:if="${comment.user.owner==0}" style="color: orange" th:text="${comment.user.username}"></a>  &nbsp;&nbsp;&nbsp;
                    <span th:text="${comment.content}">测试内容测试内容测试内容测试内容测试内容测试内容测试内容</span>
                </p>
                <hr class="col-lg-12 col-md-12 col-sm-12 col-xs-12 comment-sp">
            </div>

            <!--回复输入框-->
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <h4>
                    提交评论
                </h4>
                <hr class="col-lg-12 col-md-12 col-sm-12 col-xs-12 comment-sp">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" id="comment" th:if="${session.user==null}">
                    <p style="margin-bottom: 15px">
                        <button type="button" class="btn btn-warning">您需要登陆以后才能评论!</button>
                    </p>
                </div>
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" id="comment_section" th:if="${session.user!=null}">
                    <div class="media">
                        <div class="media-left">
                            <a href="#">
                                <img class="media-object img-rounded"
                                     th:src="@{${session.user.avatar}}" style="width: 60px;margin-bottom: 10px">
                            </a>
                        </div>
                        <div class="media-body">
                            <h5 class="media-heading">
                                <span th:if="${session==null}">匿名用户</span>
                                <span th:if="${session!=null}" th:text="${session.user.username}">匿名用户</span>
                            </h5>
                        </div>
                    </div>
                    <form th:action="@{/addComment(pid=${post.id})}" method="post">
                        <textarea class="form-control comment" rows="6" name="content" id="comment_content"></textarea>
                        <button style="float: right;margin-top: 10px;margin-bottom: 10px" type="submit" class="btn btn-success btn-comment" id="com">评论</button>
                    </form>
                </div>
        </div>
    </div>
        <div class="col-lg-3 col-md-12 col-sm-12 col-xs-12">
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="margin-bottom: 15px">
                <h4>发起人</h4>
                <img th:src="@{${post.user.avatar}}" style="width: 60px;border-radius: 50%">
<!--                <p style="position: absolute;right: 65px;top: 25px;">-->
<!--                    <span th:if="${post.userOwner==0}" style="color:orange" th:text="${post.userUsername+'(吧主☀)'}">用户名</span> <br>-->
<!--                    <span th:if="${post.userOwner==1}" style="color:pink" th:text="${post.userUsername}+'(贡献用户🌙)'">用户名</span> <br>-->
<!--                    <span th:if="${post.userOwner==2}" style="color:#2aabd2" th:text="${post.userUsername}+'(普通用户⭐)'">用户名</span> <br>-->
<!--                    <span th:text="${post.userSign}">签名</span>-->
<!--                </p>-->
                <p th:if="${post.user.owner==0}" style="position: absolute;right: 80px;top: 40px;">
                    <a th:href="@{/userInfo(uid=${post.user.id})}" style="color:orange" th:text="${post.user.username+'(吧主☀)'}">用户名</a> <br>
                    <span th:text="${post.user.sign}">签名</span>
                </p>
                <p th:if="${post.user.owner==1}" style="position: absolute;right: 80px;top: 40px;">
                    <a th:href="@{/userInfo(uid=${post.user.id})}" style="color:pink" th:text="${post.user.username+'(贡献用户🌙)'}">用户名</a> <br>
                    <span th:text="${post.user.sign}">签名</span>
                </p>
                <p th:if="${post.user.owner==2}" style="position: absolute;right: 80px;top: 40px;">
                    <a th:href="@{/userInfo(uid=${post.user.id})}" style="color:#2aabd2" th:text="${post.user.username+'(普通用户⭐)'}">用户名</a> <br>
                    <span th:text="${post.user.sign}">签名</span>
                </p>
            </div>
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <h4>吧主微信</h4>
                <img th:src="@{/img/wechat.png}" style="width: 300px;height: 300px">
            </div>
            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <h4>推荐帖子</h4>
                <p th:each="otherPost:${pushPost}">
                    <a th:if="${post.id!=otherPost.id}" style="color: #2aabd2" th:text="${otherPost.title}" th:href="@{/post(pid=${otherPost.id})}">测试标题</a>
                </p>
            </div>
        </div>
    </div>
</div>
</body>
</html>
<script>
    document.getElementById("com").onclick=function () {
        alert("评论成功!");
    }
</script>